<template>
  <div>
    <el-container>
      <el-header>
        <div class="title_box">
          <h3 class="title">欢迎,{{ userID }}</h3>
          <!-- 右边的退出按钮 -->
          <el-button type="primary" class="loginOut" @click="loginOut"
            >退出登录</el-button
          >
        </div>
      </el-header>
      <el-container>
        <el-aside width="200px">
          <el-row class="tac">
            <el-col>
              <el-menu
                class="el-menu-vertical-demo"
                @open="handleOpen"
                @close="handleClose"
                background-color="#333744"
                text-color="#fff"
                :collapse-transition="false"
                :unique-opened="true"
                :show-timeout="0"
                :router="true"
                :default-active="this.$route.path"
                v-if="userID === '管理用户'"
              >
                <el-submenu index="1">
                  <template slot="title">
                    <i class="el-icon-setting"></i>
                    <span>审核</span>
                  </template>
                  <el-menu-item-group>
                    <el-menu-item index="/home/manage/userverify">
                      <i class="el-icon-menu"></i>
                      <span slot="title">用户审核</span>
                    </el-menu-item>
                    <el-menu-item index="/home/manage/article">
                      <i class="el-icon-document"></i>
                      <span slot="title">文章审核</span>
                    </el-menu-item>

                    <el-menu-item index="/home/manage/course">
                      <i class="el-icon-tickets"></i>
                      <span slot="title">课程审核</span>
                    </el-menu-item>
                  </el-menu-item-group>
                </el-submenu>
                <!-- <el-menu-item index="/home/manage/userverify">
                  <i class="el-icon-menu"></i>
                  <span slot="title">用户审核</span>
                </el-menu-item> -->
                <!-- <el-menu-item index="/home/manage/article">
                  <i class="el-icon-document"></i>
                  <span slot="title">文章审核</span>
                </el-menu-item> -->
                <el-menu-item index="/home/manage/user">
                  <i class="el-icon-user"></i>
                  <span slot="title">用户管理</span>
                </el-menu-item>
                <!-- <el-menu-item index="/home/manage/course">
                  <i class="el-icon-setting"></i>
                  <span slot="title">课程审核</span>
                </el-menu-item> -->
                <!-- <el-menu-item index="/home/manage/user">
                  <i class="el-icon-setting"></i>
                  <span slot="title">用户管理</span>
                </el-menu-item> -->
              </el-menu>

              <el-menu
                class="el-menu-vertical-demo"
                @open="handleOpen"
                @close="handleClose"
                background-color="#333744"
                text-color="#fff"
                :collapse-transition="false"
                :unique-opened="true"
                :show-timeout="0"
                :router="true"
                :default-active="this.$route.path"
                v-else
              >
                <el-submenu index="1">
                  <template slot="title">
                    <i class="el-icon-setting"></i>
                    <span>文章</span>
                  </template>
                  <el-menu-item-group>
                    <el-menu-item index="/home/student/articleEdit">
                      <i class="el-icon-document"></i>
                      新建文章</el-menu-item
                    >
                    <el-menu-item index="/home/student/articleList">
                      <i class="el-icon-document"></i>
                      文章列表</el-menu-item
                    >
                  </el-menu-item-group>
                </el-submenu>

                <el-submenu index="2">
                  <template slot="title">
                    <i class="el-icon-setting"></i>
                    <span>课程</span>
                  </template>
                  <el-menu-item-group>
                    <el-menu-item index="/home/student/courseList">
                      <i class="el-icon-document"></i>
                      课程列表</el-menu-item
                    >
                    <!-- <el-menu-item index="/home/student/courseSection">
                    <i class="el-icon-document"></i>
                      课程章节</el-menu-item> -->
                  </el-menu-item-group>
                </el-submenu>

                <el-menu-item index="/home/student/self">
                  <i class="el-icon-menu"></i>
                  <span slot="title">个人信息</span>
                </el-menu-item>

                <!-- <el-menu-item index="/home/student/article">
                    <i class="el-icon-document"></i>
                    <span slot="title">文章发布</span>
                  </el-menu-item>
                  <el-menu-item index="/home/student/course">
                    <i class="el-icon-setting"></i>
                    <span slot="title">课程发布</span>
                  </el-menu-item> -->

                <!-- <el-menu-item index="/home/student/self">
                  <i class="el-icon-menu"></i>
                  <span slot="title">个人信息</span>
                </el-menu-item>
                <el-menu-item index="/home/student/article">
                  <i class="el-icon-document"></i>
                  <span slot="title">文章发布</span>
                </el-menu-item>
                <el-menu-item index="/home/student/course">
                  <i class="el-icon-setting"></i>
                  <span slot="title">课程发布</span>
                </el-menu-item> -->
              </el-menu>
            </el-col>
          </el-row>
        </el-aside>
        <el-main>
          <router-view></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
export default {
  data() {
    return {
      userID: "",
    };
  },
  methods: {
    handleOpen() {},
    handleClose() {},
    // 退出登录
    loginOut() {
      window.sessionStorage.clear();
      this.$router.push("/login");
    },
  },
  created() {
    this.userID =
      this.$router.history.current.path.split("/")[2] === "student"
        ? "研究生用户"
        : "管理用户";
  },
};
</script>

<style scoped>
.title_box {
  display: flex;
  position: relative;
}
.logo_image {
  height: 60px;
}
.title {
  font-size: 25px;
  color: white;
  margin: 0px;
  line-height: 60px;
  margin-left: 30px;
  font-weight: 400;
}
.loginOut {
  position: absolute;
  right: 100px;
  top: 10px;
}
.addManage {
  margin-bottom: 20px;
}
</style>
